<template>
    <img src="../assets/title.png" @dragstart.prevent />
    <div class="right">
        <a-tooltip>
            <template #title><span>下载</span></template>
            <CloudDownloadOutlined @click="store.commit('ChangePluginDrawer',true)" />
        </a-tooltip>
        <a-tooltip>
            <template #title><span>刷新</span></template>
            <SyncOutlined :spin="showSpin" @click="refresh" />
        </a-tooltip>
    </div>
</template>
<script setup>
import { ref } from 'vue';
import SyncOutlined from '@ant-design/icons-vue/SyncOutlined';
import CloudDownloadOutlined from '@ant-design/icons-vue/CloudDownloadOutlined';
import { useStore } from 'vuex'
const store = useStore()
const showSpin = ref(false);

const refresh = () => {
    store.dispatch('GetApps');
};
refresh();

</script>
<style scoped>
img {
    height: 60px;
    display: block;
    margin: 10px 0;
    float: left;
}
.right {
    padding-top: 10px;
    float: right;
    font-size: 20px;
    color: #999;
}
.anticon {
    margin-left: 20px;
    transition: color 0.3s;
}
.anticon:hover {
    color: #ccc;
}
</style>
